import { useState, forwardRef, useImperativeHandle } from "react";

const Counter = forwardRef((props, ref) => {
    const [count, setCount] = useState(0);
    useImperativeHandle(
        ref,
        () => {
            console.log("useImperativeHandle");
            return {
                reset: () => {
                    setCount(0);
                },
            };
        },
        []
    );
    return (
        <>
            <div className='alert alert-info'>当前count值为：{count}</div>
            <button
                className='btn btn-block btn-default'
                onClick={() => setCount(count + 2)}
            >
                counter组件调用
            </button>
        </>
    );
});

export default Counter;
